    // 获取设置
    const config = window.AppConfig.getConfig()

    
    // 标签页切换
    const tabs = document.querySelectorAll('.settings-tab');
    const panels = document.querySelectorAll('.settings-panel');
    const addSourceButton = document.getElementById('addSourceButton');
    const addSourceModal = document.getElementById('addSourceModal');

    tabs.forEach(tab => {
      loadTab(tab.dataset.tab)
      tab.addEventListener('click', () => {
        // 移除所有active类
        tabs.forEach(t => t.classList.remove('active'));
        panels.forEach(p => p.style.display = 'none');

        // 添加active类到当前标签
        tab.classList.add('active');
        
        // 显示对应面板
        const panel = document.querySelector(`.settings-panel[data-panel="${tab.dataset.tab}"]`);
        if (panel) {
          panel.style.display = 'block';
        }
        
      });
    });
    function loadTab(tabName) {
      console.log(tabName)
      if(tabName == 'media')
        {
          renderSettingSources(); // 渲染源列表 
        }
    }
    // 添加源按钮点击事件
    addSourceButton.addEventListener('click', () => {
      addSourceModal.classList.add('open');
    });

    // 渲染源列表
    function renderSettingSources() {
      const sources = config.sources || [];
      const activeSourceId = config.activeSourceId;
      console.log(sources)
      const settingsSourceList = document.getElementById('settingsSourceList');
      if (!sources) return;
      if (sources.length === 0) {
        settingsSourceList.innerHTML = `
          <div class="source-dropdown-empty">
            <i class="ri-database-2-line"></i>
            <p>暂无媒体源</p>
          </div>
        `
        return;
      }
      settingsSourceList.innerHTML = ''; // 清空列表



    sources.forEach((source) => {
      const isActive = source.id === activeSourceId
      const sourceItem = document.createElement("div")
      sourceItem.className = `source-dropdown-item ${isActive ? "active" : ""}`
      sourceItem.innerHTML = `
        <div class="source-dropdown-item-name">
          <span>${source.name}</span>
          ${isActive ? '<span class="source-dropdown-badge">当前</span>' : ""}
        </div>
        <div class="source-dropdown-item-actions">
          <button class="btn-icon source-dropdown-edit" data-id="${source.id}" title="编辑">
            <i class="ri-edit-line"></i>
          </button>
          <button class="btn-icon source-dropdown-delete" data-id="${source.id}" title="删除">
            <i class="ri-delete-bin-line"></i>
          </button>
        </div>
      `

      if (!isActive) {
        sourceItem.addEventListener("click", (e) => {
          if (!e.target.closest(".source-dropdown-edit") && !e.target.closest(".source-dropdown-delete")) {
            window.AppConfig.setActiveSource(source.id)
            sourceDropdown.classList.remove("open")
            updateSidebarBadges()
            showToast("已切换媒体源")

            // 刷新页面以应用新源
            setTimeout(() => {
              window.location.reload()
            }, 1000)
          }
        })
      }

      settingsSourceList.appendChild(sourceItem)
    })





      
      



    }